<template>
    <div>
        <router-view></router-view>
    </div>
</template>

<script>
    import Vue from 'vue';
    import {select_user_by_username,select_Friend,select_message_left} from "../request/api";
    import Cookies from 'js-cookie';
    import {Toast,Notify} from 'vant';

    Vue.use(Toast).use(Notify);

    export default {
        name: "center",
        data(){
            return{
                websocket:null,
            }
        },

        created(){

        },

        beforeDestroy(){
            console.log("center页面销毁了")
            this.$store.commit("cleanWebSocket");
        },

        mounted() {

            //查询自身信息 存入状态管理
            select_user_by_username({"username":Cookies.get('username')}).then(res=>{
                this.$store.commit("setMySelfAttribute",res.data);

                //查询好友列表 存入状态管理
                let myid={
                    "fromid":this.$store.state.myselfAttribute.username,
                }
                select_Friend(myid).then(res=>{
                    if(res.data.type !== "null"){
                        this.$store.commit("setFriendList",res.data);
                    }
                })

            })

            //查询messageList列表
            let select_message_left_data={
                "fromid":Cookies.get('username'),
            }
            select_message_left(select_message_left_data).then(res=>{
                if(res.data.length === 0){
                    this.$store.commit("setMessageList",null);
                }else{
                    this.$store.commit("setMessageList",res.data);
                }
            })


            //每当加载到center页面时判断socket是否为空 为空则创建之
            if(this.$store.state.websocket === null){
                this.$store.commit("setWebSocket",new WebSocket("ws://120.78.80.190:8282"));

                //当连上socket服务器时绑定username
                this.$store.state.websocket.onopen = () => {
                    let message={
                        "username":Cookies.get('username'),
                        "type":"bind",
                    }
                    this.$store.state.websocket.send(JSON.stringify(message));
                }
            }


            //socket消息接收判断 超级多代码
            this.$store.state.websocket.onmessage= e =>{
                console.log(e);
                let accept_data=e.data;
                if((accept_data.includes(" ")) || (accept_data.includes("\r")) || (accept_data.includes("\n"))){
                    let tmp_data={
                        "type":"error"
                    }
                    accept_data=JSON.stringify(tmp_data);
                }
                let result=JSON.parse(accept_data);
                console.log(result);
                switch (result.type) {
                    case "bind":
                        if(result.state == 'success'){
                            console.log("绑定成功 center里面");
                        }else{
                            console.log("绑定失败 center里面");
                        }
                        break;
                    case "addFriend":
                        console.log("在 好友B 的通知页里面");
                        Notify({ type: 'success', message: '有人请求添加好友' });
                        break;
                    case "reload_friendList":
                        console.log("测试reloadFriend通知");
                        let myid={
                            "fromid":this.$store.state.myselfAttribute.username,
                        }
                        select_Friend(myid).then(res=>{
                            console.log("测试收到的数据",res);
                            this.$store.commit("setFriendList",res.data);
                            console.log("收到对方跟新")
                        })
                        break;
                    case "reload_chat_list":
                        console.log("在case里面");
                        //用bus通信到chat页面 调用重新渲染chat列表方法
                        let filterPath=['/center/chat','/message'];
                        if(this.$router.currentRoute.path === '/center/chat'){
                            this.$store.state.bus.$emit("reload_chat_list");
                        }
                        if(!filterPath.includes(this.$router.currentRoute.path)){
                            Notify({ type: 'success', message: '有新消息' });
                        }
                        break;

                    case "reload_message_list":
                        console.log("reload_message_list 收到了");

                        let select_message_left_data={
                            "fromid":Cookies.get('username'),
                        }

                        select_message_left(select_message_left_data).then(res=>{
                            if(res.data.length === 0){
                                this.$store.commit("setMessageList",null);
                            }else{
                                this.$store.commit("setMessageList",res.data);
                            }
                        })

                        break;
                }
            }
        }
    }
</script>

<style scoped>

</style>